<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Edit Room</title>
<script src="../js/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="../js/jquery.validate.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" type="text/javascript"></script>
<script type="text/javascript">
  $(document).ready(function() {
	  $("#checkEnd").hide();
	  jQuery.ajax({
		     type:"POST",
		     url:"../jsp/Edit-Room.jsp",
		     success:function(html){
		      var response = $(html);
		      $("#roomName").val(response.filter('#roomName').text());
		      $("#roomType").val(response.filter('#roomType').text());
		      $("#roomSize").val(response.filter('#roomSize').text());
		      $("#pricePerDay").val(response.filter('#pricePerDay').text());
		      if(response.filter('#facility1').text()=='Y'){
		  	  	$('input[name=facility1]').attr('checked',true);
		      }
		      if(response.filter('#facility2').text()=='Y'){
			  	  	$('input[name=facility2]').attr('checked',true);
			      }
		      if(response.filter('#facility3').text()=='Y'){
			  	  	$('input[name=facility3]').attr('checked',true);
			      }
		      if(response.filter('#facility4').text()=='Y'){
			  	  	$('input[name=facility4]').attr('checked',true);
			      }
		      $("#roomPhotos").html(response.filter('#roomPhotos').html());
		     }
		    });
  });
</script> 
</head>
<body>
<div id="container">
	<form id="form1" method="post" enctype="multipart/form-data" action="../editRoomService">
		<ul>
			<li>
				<label>Room Name<span class="rq"> * </span></label>
				<input id="roomName" class="required" type="text" name="roomName">
			</li>
			<li>
				<label>Type Of Room</label>
				<select id="roomType" name="typeOfRoom">
				<option value="Single" selected>Single</option>
				<option value="Double">Double</option>
				</select>
			</li>
			<li>
				<label>Size<span class="rq"> * </span></label>
				<input id="roomSize" class="required" type="text" name="size">
			</li>
			<li>
				<label>Price Per Day<span class="rq"> * </span></label>
				<input id="pricePerDay" class="required number" type="text" name="pricePerDay">
			</li>
			<li>
				<label>Facility</label>
			</li>
			<li>
				<input id="facility1" type="checkbox" name="facility1" value="Y"/>Inside Bathroom<br>
				<input id="facility2" type="checkbox" name="facility2" value="Y"/>Television<br>
				<input id="facility3" type="checkbox" name="facility3" value="Y"/>Air Condition<br>
				<input id="facility4" type="checkbox" name="facility4" value="Y"/>Fridge
				<input id="checkEnd" type="text" name="checkEnd">
			</li>
			<li>
				<div id="roomPhotos"></div>
			</li>
			<li>
				<label>photo 1</label>
				<input type="file" name="file1" size="50">
			</li>
			<li>
				<label>photo 2</label>
				<input type="file" name="file2" size="50">
			</li>
			<li>
				<label>photo 3</label>
				<input type="file" name="file3" size="50">
			</li>
			<li>
				<input type="submit" name="Add">
			</li>	
		</ul>
	</form>
</div>
</body>
</html>